<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core">

    <h:head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <script src="./resources/js/jquery-1.7.2.min.js" type="text/javascript" />
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript">
            $(function(){
//                alert(args.loggedIn);
//                if(args.validationFailed || !args.loggedIn) {
//                    jQuery('#dialog').effect("shake", { times:3 }, 100);
//                    jQuery('#logoutLink').fadeOut();
//                } else {
//                    dlg.hide();
//                    jQuery('#loginLink').fadeOut();
//                }
            });
        </script>
        <title>Foodspotting :: Share your favourite dish, restaurant...</title>
    </h:head>
        
    <h:body>
        <div id="background">
            <img src="./resources/img/bg6.jpg" class="stretch" alt="" />
        </div>

        <div id="top" class="top">
            <ui:insert name="top">
                <h:graphicImage url="./resources/img/FoodspottingLogo.png" style="width: 960px"/>
                <h:form>
                    <p:menubar>
                        <p:menuitem value="Home" url="home.xhtml" />
                        <c:if test="#{loginBean.loggedIn}" >
                        <p:menuitem value="MySpots" url="myspots.xhtml" />
                        </c:if>
                        <p:menuitem value="Restaurants" url="restaurants.xhtml"/>
                    </p:menubar>
                </h:form>
            </ui:insert>
        </div>
        <div>
            <div id="left">
                <ui:insert name="left">
                    <c:choose>
                        
                        <c:when test="${not loginBean.loggedIn}">
                            
                            <p:accordionPanel> 
                                <p:tab title="Welcome"> 
                                    <h:outputLink id="loginLink" value="javascript:void(0)" onclick="loginDlg.show()" title="login">	
                                        Login
                                    </h:outputLink>
                                    <br/> <br/>
                                        
                                    <h:link id="SignOut" value="Sign Up!"  outcome="NewUser" />
                                </p:tab>
                            </p:accordionPanel>
                                
                        </c:when>
                        <c:otherwise>
                            
                            <p:accordionPanel>
                                <p:tab title="FoodSpotting">  
                                    <h:form> 
                                        <p:commandLink id="logoutButton" value="Logout" update=":growl" 
                                                       actionListener="#{loginBean.logout(actionEvent)}" 
                                                       oncomplete="location.reload()"
                                                       />
                                        <br/>    <br/> 
                                            
                                        
                                        <h:link outcome="newspot" value="Add New Spot" />
                                    </h:form>
                                    <br />
                                    <h:outputText value="Welcome #{loginBean.user.fname} #{loginBean.user.lname}" />
                                </p:tab> 
                                    
                                    
                            </p:accordionPanel> 
                                
                        </c:otherwise>
                            
                    </c:choose>
                    <p:growl id="growl" showDetail="true" life="3000" />
                    <!-- LOGIN ################################################################# -->            
                    <p:dialog id="dialog" header="Login" widgetVar="loginDlg">
                        <h:form>
                            
                            <h:panelGrid columns="2" cellpadding="5">
                                <h:outputLabel for="username" value="Username:" />
                                <p:inputText value="#{loginBean.user.username}" 
                                             id="username" required="true" label="username" />
                                                 
                                <h:outputLabel for="password" value="Password:" />
                                <h:inputSecret value="#{loginBean.user.password}" 
                                               id="password" required="true" label="password" />
                                                   
                                <f:facet name="footer">
                                    
                                    <p:commandButton id="loginButton" value="Login" update=":growl" 
                                                     actionListener="#{loginBean.login(actionEvent)}" 
                                                     oncomplete="handleLoginRequest(xhr, status, args)"/>
                                </f:facet>
                            </h:panelGrid>
                                
                        </h:form>
                    </p:dialog>
                    <br />    
                    <c:if test="${loginBean.loggedIn}">
                        <!-- NEW RESTAURANT ################################################################# -->                      
                        <p:dialog id="newRestDialog" header="New Restaurant" widgetVar="newRestDlg" modal="true" resizable="false">  
                            <h:form id="newRestForm">  
                                <p:panel id="newRestPanel">
                                    <p:messages id="msgs"/>
                                    <h:panelGrid columns="3" style="margin-bottom:10px">
                                        <div> 
                                            <p:graphicImage styleClass="userImg" value="/resources/img/restaurants/defaultRestaurant.png"/> 
                                        </div>
                                        <h:outputLabel for="rname" value="Name :" />  
                                        <p:inputText id="rname" value="#{newrestaurantbean.restaurant.name}" required="true" label="RestaurantName" >
                                            <f:validateLength minimum="2" />  
                                        </p:inputText>
                                        <p:message for="rname" display="icon"/> 
                                        <h:outputLabel for="rpic" value="Picture :" />  
                                        <p:inputText id="rpic" value="#{newrestaurantbean.restaurant.pic}" />
                                        <p:message for="rpic" display="icon"/>
                                        <h:outputLabel for="location" value="Location :" />  
                                        <p:inputTextarea id="location" value="#{newrestaurantbean.restaurant.location}"  required="true" ></p:inputTextarea>
                                        <p:message for="location" display="icon"/>
                                    </h:panelGrid>  
                                        
                                    <p:commandButton id="submitButton2" value="Add" update="newRestPanel"
                                                     actionListener="#{newrestaurantbean.createRestaurant()}" oncomplete="handleNewRestRequest(xhr, status, args)"/>
                                </p:panel>
                            </h:form>  
                        </p:dialog>
                    </c:if>
                    <script type="text/javascript">
                        function handleLoginRequest(xhr, status, args) {
                            if(args.validationFailed || !args.loggedIn) {
                                jQuery('#dialog').effect("shake", { times:3 }, 100);
                            } else {
                                loginDlg.hide();
                                jQuery('#loginLink').fadeOut();
                                location.reload();
                            }
                        }
                        
                        function handleNewRestRequest(xhr, status, args) {
                            if(args.validationFailed) {
                                jQuery('#newRestDialog').effect("shake", { times:2 }, 100);
                            } else {
                                newRestDlg.hide();
                            }
                        }
                        
                    </script>
            
                </ui:insert>
            </div>
            <div id="content" class="left_content">
                <ui:insert name="content">
                    
                </ui:insert>
            </div>
        </div>
    </h:body>

</html>
